import QtQuick
import QtQuick.Controls
import Qt.labs.platform

Rectangle {
    id: frameCutRect
    width: 640
    height: 480
    clip: true
    visible: false
    color: mBackColor

    signal frameCutSaveTriggered()

    property int noteIndex: 0

    property color mBackColor: "#34393e"
    property color mTextColor: "#e1e4e8"
    property color mContentColor: "#44484d"

    property var helpContent: qsTr(" \
1. 起始帧和结束帧应输入大于等于1且小于等于有效帧数的数值\n \
2. 裁剪会删除所选帧区间的灯效，裁剪1-1是删除第一帧，裁剪1-2是删除第一和第二帧\n \
3. 保留会删除所选帧区间以外的灯效，保留1-1是保留第一帧，保留1-2是保留第一和第二帧\n \
4. 以上操作目前不可逆，请谨慎操作 \
")
    // 裁剪帧或保存帧操作事件
    function frameCutSaveActioned(mode) {
        var noteStr, modeTemp
        var frameNum = myHandle.getMyProperty("fValidNum")
        var start, end
        if(mode === "cut") {
            start = startFrameCut.inputText
            end = endFrameCut.inputText
            modeTemp = qsTr("裁剪")
        } else if(mode === "save") {
            start = startFrameSave.inputText
            end = endFrameSave.inputText
            modeTemp = qsTr("保留")
        }
        noteStr = qsTr("从" + start + "到" + end + " --- 旧帧数:" + frameNum)
        if(myHandle.saveOrCutFrame(Number(start), Number(end), mode)) {
            frameNum = myHandle.getMyProperty("fValidNum")
            noteStr = qsTr(modeTemp + noteStr + " 新帧数:" + frameNum)
            saveCutNoteModel.append({ "noteTitle": Qt.formatDateTime(new Date(), "hh-mm-ss"), "noteText": noteStr })
            frameCutSaveTriggered()
        } else {
            noteStr = qsTr(modeTemp + "操作错误!")
            saveCutNoteModel.append({ "noteTitle": Qt.formatDateTime(new Date(), "hh-mm-ss"), "noteText": noteStr })
        }
    }

    CustomHeaderBarClose {
        id: headerBar
        x: 0
        y: 0
        width: parent.width
        height: 34
        chbTitleText: qsTr("裁剪和保留")
        chbHelpText: helpContent

        onClosePageBtnClicked: {
            parent.visible = false
        }
    }

    Column {
        anchors.top: headerBar.bottom
        anchors.bottom: parent.bottom
        width: parent.width
        spacing: 20
        padding: 20

        CustomBorderTitle {
            id: cbtFrameCut
            width: parent.width - parent.padding * 2
            height: 70
            radius: 10
            cbtTitle: qsTr("裁剪设置")
            cbtTitleBackColor: mBackColor
            cbtTitleX: 30
            cbtFontSize: 14
            cbtTitleColor: mTextColor
            color: mContentColor

            Row {
                x: 10
                y: 20
                width: parent.width
                height: 30
                spacing: 20

                TitleTextInput {
                    id: startFrameCut
                    width: 120
                    height: parent.height
                    titleText: qsTr("起始帧:")
                    titleWidth: 60
                    textColor: mTextColor
                    textSize: 14
                    inputBackColor: mContentColor
                    inputBorderWidth: 1
                    inputBorderColor: "#888888"
                    inputText: "1"
                    inputValidator: RegularExpressionValidator { regularExpression: /[0-9]+/ } // 文本验证器 仅可输入数字
                }

                TitleTextInput {
                    id: endFrameCut
                    width: 120
                    height: parent.height
                    titleText: qsTr("结束帧:")
                    titleWidth: 60
                    textColor: mTextColor
                    textSize: 14
                    inputBackColor: mContentColor
                    inputBorderWidth: 1
                    inputBorderColor: "#888888"
                    inputText: "1"
                    inputValidator: RegularExpressionValidator { regularExpression: /[0-9]+/ } // 文本验证器 仅可输入数字
                }

                AsButton {
                    id: frameCutBtn
                    width: 60
                    height: parent.height
                    text: qsTr("裁剪")
                    font.pixelSize: 14
                    borderWidth: 1
                    backColor: mContentColor
                    textColor: mTextColor
                    itemRadius: 8

                    onClicked: {
                        frameCutSaveActioned("cut")
                    }
                }
            }
        }

        CustomBorderTitle {
            id: cbtFrameSave
            width: parent.width - parent.padding * 2
            height: 70
            radius: 10
            cbtTitle: qsTr("保留设置")
            cbtTitleBackColor: mBackColor
            cbtTitleX: 30
            cbtFontSize: 14
            cbtTitleColor: mTextColor
            color: mContentColor

            Row {
                x: 10
                y: 20
                width: parent.width
                height: 30
                spacing: 20

                TitleTextInput {
                    id: startFrameSave
                    width: 120
                    height: parent.height
                    titleText: qsTr("起始帧:")
                    titleWidth: 60
                    textColor: mTextColor
                    textSize: 14
                    inputBackColor: mContentColor
                    inputBorderWidth: 1
                    inputBorderColor: "#888888"
                    inputText: "1"
                    inputValidator: RegularExpressionValidator { regularExpression: /[0-9]+/ } // 文本验证器 仅可输入数字
                }

                TitleTextInput {
                    id: endFrameSave
                    width: 120
                    height: parent.height
                    titleText: qsTr("结束帧:")
                    titleWidth: 60
                    textColor: mTextColor
                    textSize: 14
                    inputBackColor: mContentColor
                    inputBorderWidth: 1
                    inputBorderColor: "#888888"
                    inputText: "1"
                    inputValidator: RegularExpressionValidator { regularExpression: /[0-9]+/ } // 文本验证器 仅可输入数字
                }

                AsButton {
                    id: frameSaveBtn
                    width: 60
                    height: parent.height
                    text: qsTr("保留")
                    font.pixelSize: 14
                    borderWidth: 1
                    backColor: mContentColor
                    textColor: mTextColor
                    itemRadius: 8

                    onClicked: {
                        frameCutSaveActioned("save")
                    }
                }
            }
        }

        CustomBorderTitle {
            id: cbtxxxx
            width: parent.width - parent.padding * 2
            height: 70
            radius: 10
            cbtTitle: qsTr("插入设置")
            cbtTitleBackColor: mBackColor
            cbtTitleX: 30
            cbtFontSize: 14
            cbtTitleColor: mTextColor
            color: mContentColor
        }

        CustomBorderTitle {
            id: cbtSaveCutNote
            width: parent.width - parent.padding * 2
            height: parent.height - cbtFrameCut.height * 3 - parent.padding * 2 - parent.spacing * 3
            radius: 10
            cbtTitle: qsTr("操作记录")
            cbtTitleBackColor: mBackColor
            cbtTitleX: 30
            cbtFontSize: 14
            cbtTitleColor: mTextColor
            color: mContentColor

            ListModel {
                id: saveCutNoteModel
//                ListElement { noteTitle: qsTr("123"); noteText: qsTr("456") }
            }

            ListView {
                id: saveCutNoteListView
                x: 10
                y: 10
                width: parent.width - 20
                height: parent.height - 20
                clip: true
                spacing: 1

                model: saveCutNoteModel
                delegate: saveCutNoteDelegate

                ScrollBar.vertical: AsScrollBar{}

                CustomMenu1 {
                    id: noteRightBtnMenu
                    width: 60
                    height: 40
                    color: mBackColor
                    cmTextColor: mTextColor
                    cmFontSize: 13
                    cmItemHeight: height / menuText.length

                    property var menuText: ["删除", "清空"]

                    Component.onCompleted: {
                        for(var i = 0; i < menuText.length; i++) {
                            noteRightBtnMenu.cmListModel.set(i, {"mText": menuText[i]})
                        }
                    }

                    onCustomMenuClicked: function(index) {
                        switch(index) {
                            case 0: saveCutNoteModel.remove(noteIndex); break;
                            case 1: saveCutNoteModel.clear(); break;
                        }
                    }
                }
            }

            Component {
                id: saveCutNoteDelegate

                Rectangle {
                    width: saveCutNoteListView.width
                    height: 16
                    color: "#414243"

                    MouseArea {
                        anchors.fill: parent
                        acceptedButtons: Qt.LeftButton | Qt.RightButton

                        onClicked: function(mouse) {
                            if(mouse.button === Qt.RightButton) {
                                noteIndex = index
                                noteRightBtnMenu.open(mouse.x, mouse.y + index * parent.height)
                            } else {
                                focus = true
                            }
                        }
                    }

                    Text {
                        id: noteTimeText
                        width: 80
                        height: parent.height
                        text: noteTitle + ":"
                        verticalAlignment: Text.AlignVCenter
                        horizontalAlignment: Text.AlignHCenter
                        color: mTextColor
                    }

                    Text {
                        id: noteContentText
                        anchors.left: noteTimeText.right
                        anchors.right: parent.right
                        height: parent.height
                        text: noteText
                        verticalAlignment: Text.AlignVCenter
                        horizontalAlignment: Text.AlignLeft
                        color: mTextColor
                    }
                }
            }
        }
    }
}
